const gulp = require('gulp'),
  babel = require('gulp-babel'),
  sass = require('gulp-sass'),
  postcss = require('gulp-postcss'),
  concat = require('gulp-concat'),
  sourcemaps = require('gulp-sourcemaps'),
  rename = require('gulp-rename'),
  del = require('del'),
  cache = require('gulp-cached'),
  runSequence = require('run-sequence'),
  cssnext = require('postcss-cssnext')

const distPath = 'dist/widget/'
const babelPath = ['html/**/*.js', 'script/**/*.js', '!script/lib/**/*.js']
// 去掉路径开头的"./"后, watch 才能监听到文件的增减
const scssPath = ['html/**/*.@(css|scss)', 'css/app.scss']
const configPath = ['config.xml', 'script/env.js']
const htmlPath = ['html/**/*.html']
const jsPath = ['script/lib/**/*.js']
const staticPath = ['static/**/*']
const cssPath = ['css/lib/**/*']

// 防止watch某一任务出错时整个进程崩掉
function swallowError (error) {
  console.error(error)
  this.emit('end')
}

gulp.task('clean', function (done) {
  del([
    distPath + 'html',
    distPath + 'css',
    distPath + 'static',
    distPath + 'script',
    distPath + 'map'
  ], {force: true})
    .then(function (data) {
      done()
    })
    .catch(function (err) {
      console.log(err)
    })
})

gulp.task('scss', function () {
  return gulp.src(scssPath, {base: '.'})
    // .pipe(cache('scss')) // import的文件修改了，主文件不会重新编译
    .pipe(sourcemaps.init()) // 初始化sourcemap
    .pipe(sass({
      outputStyle: 'compressed'
    })
      .on('error', sass.logError))
    .pipe(postcss([
      cssnext({
        browsers: [
          'android 2.3',
          'ios 7'
        ]
      })
    ]))

    .pipe(sourcemaps.write('./map'))

    // .pipe(rename(function (path) {
    //   path.dirname = path.dirname.replace(/^scss/, 'css')
    // }))
    .on('error', swallowError)
    .pipe(gulp.dest(distPath)) // 输出路径
})

gulp.task('babel', function () {
  return gulp.src(babelPath, {base: '.'})
    .pipe(cache('babel'))
    .pipe(sourcemaps.init()) // 初始化sourcemap
    .pipe(babel())
    .on('error', swallowError)
    .pipe(sourcemaps.write('./map')) // 导出sourcemap
    .on('error', swallowError)
    .pipe(gulp.dest(distPath))
})

gulp.task('copyHtml', function () {
  return gulp.src(htmlPath, {base: '.'})
    .pipe(cache('copyHtml'))
    .pipe(gulp.dest(distPath))
})
gulp.task('copyJs', function () {
  return gulp.src(jsPath, {base: '.'})
    .pipe(cache('copyJs'))
    .pipe(gulp.dest(distPath))
})
gulp.task('copyCss', function () {
  return gulp.src(cssPath, {base: '.'})
    .pipe(cache('copyCss'))
  // .pipe(rename(function (path) {
  //     path.dirname = path.dirname.replace(/^css/, 'css/lib')
  // }))
    .pipe(gulp.dest(distPath))
})
gulp.task('copyConfig', function () {
  return gulp.src(configPath, {base: '.'})
    .pipe(gulp.dest(distPath))
})
gulp.task('copyStatic', function () {
  return gulp.src(staticPath, {base: '.'})
    .pipe(cache('copyStatic'))
    .pipe(gulp.dest(distPath))
})

gulp.task('build', function (done) {
  runSequence(
    'clean',
    ['scss', 'babel', 'copyHtml', 'copyJs', 'copyStatic', 'copyCss', 'copyConfig'],
    done
  )
})

gulp.task('watch', ['build'], function () {
  gulp.watch(scssPath.concat(['css/**/*.scss']), ['scss'])
  gulp.watch(babelPath, ['babel'])
  gulp.watch(htmlPath, ['copyHtml'])
  gulp.watch(cssPath, ['copyCss'])
  gulp.watch(jsPath, ['copyJs'])
  gulp.watch(staticPath, ['copyStatic'])
  gulp.watch(configPath, ['copyConfig'])
})
